<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <script language="javascript">
        function draw() {
            var ctx = document.getElementById('myCanvas').getContext('2d');
            var img = new Image();
            img.onload = function(){
                ctx.drawImage(img,0,0);
                ctx.font = "italic 60px Arial Black";
                ctx.shadowOffsetX = 3;
                ctx.shadowOffsetY = 3;
                ctx.shadowBlur = 2;
                ctx.shadowColor = "rgba(0, 0, 0, 0.7)";
                ctx.fillStyle = "White";
                ctx.fillText("测试一下",50,165);
            }
            img.src = '../images/bg.jpg';
        }
        window.onload=function(){
            draw();
        }
    </script>
</head>
<body>
<canvas id="myCanvas" width="300" height="200"></canvas>
</body>
</html>